<template>
  <div>
    <div v-for="(item, index) in list" :key="item + index">
      <!-- 病历 -->
      <el-row v-if="item.level == 0">
        <Info :item="item" :isFinish="isFinish"></Info>
      </el-row>
      <!-- 检查项目 -->
      <el-row v-else>
        <el-col :span="4" style="text-align: right">
          <label class="tit2">{{ item.project }}</label>
        </el-col>

        <el-col :span="20">
          <div v-if="item.items && item.items.length > 0 && item.seq != 2">
            <el-form label-width="100px">
              <Item :list="item.items" :clinicNo="clinicNo" :isFinish="isFinish"></Item>
            </el-form>
          </div>
        </el-col>
      </el-row>
      <div v-if="item.children && item.children.length > 0 && !item.items">
        <form-item :list="item.children" :clinicNo="clinicNo"></form-item>
      </div>
    </div>
  </div>
</template>

<script>
import Info from "./Info";
import Item from "./Item";
export default {
  name: "FormItem",
  components: {
    Info,
    Item
  },
  props: {
    isFinish:{
      type:Boolean,
      default:false
    },
    clinicNo: {
      type: String,
      default: ""
    },
    list: Array
  },
  created() {},
  data() {
    return {};
  },
  methods: {}
};
</script>

<style lang="scss" scoped>
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clearfix {
  *zoom: 1;
}
.tit1 {
  width: 100%;
  background: #eee;
  text-align: left;
  text-indent: 2em;
  float: left;
  font-size: 14px;
  color: #606266;
  line-height: 40px;
  padding: 0 12px 0 0;
}
.tit2 {
  text-align: right;
  font-size: 14px;
  color: #999;
  line-height: 40px;
  padding: 0 12px 0 0;
  width: auto;
  min-width: 50px;
}
</style>
